<template>
  <div class="box">
    <topLogin :isIndex="false"></topLogin>
    <topNav :isActive="2"></topNav>
    <div class="wid-1200 min-height">
      <Breadcrumb separator=">">
        <BreadcrumbItem>当前位置</BreadcrumbItem>
        <BreadcrumbItem>图说景区</BreadcrumbItem>
      </Breadcrumb>
      <!-- 片区景点 -->
      <div>
        <div class="title-box">
          <p>片区景点</p>
          <router-link :to="{path:'/picture/list', query:{type:0}}">+MORE</router-link>
        </div>
        <div class="picture-tab">
          <Tabs>
            <TabPane v-for="(item,index) in scenicList" :key="index" :label="item.title">
              <ImageList :ImageList="item.list"></ImageList>
            </TabPane>
          </Tabs>
        </div>
      </div>
      <!-- 特色景点 -->
      <div>
				<div class="title-box">
					<p>特色景点</p>
					<router-link :to="{path:'/picture/list', query:{type:1}}">+MORE</router-link>
				</div>
					<mySwiper :ImgList="imgList" :Content="content" @FatherMethod="goDetail"></mySwiper>
			</div>
      <!-- 展馆建筑介绍 -->
      <div>
        <div class="title-box">
          <p>展馆建筑介绍</p>
          <router-link :to="{path:'/picture/list', query:{type:2}}">+MORE</router-link>
        </div>
        <ImageText :ImageText="list"></ImageText>
      </div>
			
    </div>

    <footNav></footNav>
  </div>
</template>

<script>
// 临时图片
import picture1 from "@/assets/temporary/picture1.png";
import picture2 from "@/assets/temporary/picture2.png";
import picture3 from "@/assets/temporary/picture3.png";
import picture4 from "@/assets/temporary/picture4.png";
import picture5 from "@/assets/temporary/picture5.png";
// 自定义组件
import topLogin from "@/components/topLogin/index";
import topNav from "@/components/topNav/index";
import footNav from "@/components/footNav/index";
import mySwiper from '@/components/mySwiper/index'
import ImageText from '@/components/imageText/index'
import ImageList from '@/components/imageList/index'
// 框架组件
import { Breadcrumb, BreadcrumbItem, Tabs, TabPane } from "view-design";
export default {
  name: "Picture",
  components: {
    topLogin,
    topNav,
		footNav,
    mySwiper,
    ImageText,
    ImageList,
    [Breadcrumb.name]: Breadcrumb,
    [BreadcrumbItem.name]: BreadcrumbItem,
    Tabs: Tabs,
    TabPane
  },
  data() {
    return {
      // 片区景点
      scenicList: [
        {
          title: "森林乐谷区",
          list: [
            { src: picture1, title: "论优美公园,我只服朝阳!" },
            { src: picture2, title: "河长的河流一般都是这样的" },
            { src: picture3, title: "论优美公园,我只服朝阳!" },
            { src: picture4, title: "河长的河流一般都是这样的" }
          ]
        },
        {
          title: "梯田湿地区",
          list: [
            { src: picture1, title: "论优美公园,我只服朝阳!" },
            { src: picture2, title: "河长的河流一般都是这样的" },
            { src: picture3, title: "论优美公园,我只服朝阳!" },
            { src: picture4, title: "河长的河流一般都是这样的" }
          ]
        },
        {
          title: "花田草甸区",
          list: [
            { src: picture1, title: "论优美公园,我只服朝阳!" },
            { src: picture2, title: "河长的河流一般都是这样的" },
            { src: picture3, title: "论优美公园,我只服朝阳!" },
            { src: picture4, title: "河长的河流一般都是这样的" }
          ]
        },
        {
          title: "活力东湖区",
          list: [
            { src: picture1, title: "论优美公园,我只服朝阳!" },
            { src: picture2, title: "河长的河流一般都是这样的" },
            { src: picture3, title: "论优美公园,我只服朝阳!" },
            { src: picture4, title: "河长的河流一般都是这样的" }
          ]
        },
        {
          title: "探险森林区",
          list: [
            { src: picture1, title: "论优美公园,我只服朝阳!" },
            { src: picture2, title: "河长的河流一般都是这样的" },
            { src: picture3, title: "论优美公园,我只服朝阳!" },
            { src: picture4, title: "河长的河流一般都是这样的" }
          ]
        }
      ],
      // 建筑
      list: [
        { src: picture1, title: "论优美公园,我只服朝阳!",content:'附近还有海鶄落湿地公园,未来科技城滨水森林公园,温榆河' },
        { src: picture2, title: "河长的河流一般都是这样的",content:'附近还有海鶄落湿地公园,未来科技城滨水森林公园,温榆河' },
        { src: picture3, title: "论优美公园,我只服朝阳!",content:'附近还有海鶄落湿地公园,未来科技城滨水森林公园,温榆河' },
        { src: picture4, title: "河长的河流一般都是这样的",content:'附近还有海鶄落湿地公园,未来科技城滨水森林公园,温榆河' }
			],
      // 特色景点
        imgList:[picture1,picture2,picture3,picture4,picture5],
       content:[
        {title:'1温榆河湿地公园', content:`温榆河公园地处朝阳、顺义、昌平三区交界，温榆河、清河两河交汇处，城市副中心上游，是重要防洪通道，也是重要生态走廊。抓好温榆河公园规划建设，大幅度扩大绿色生态空间、满足人民群众对优美生态环境需要的重大民生工程，是落实新一版城市总体规划的一个亮点。
        “一轴一脉、九区一园”。“一轴”即游园栈道轴线；“一脉”即湿地净化水脉；“九区”分别为浅山梯田、湿地水乡、芦苇水淀、探险森林、花溪锦田、活力东湖、疏林草甸、清河乐谷、月色荷塘；“一园”即一期示范区公园。`},
        {title:'2温榆河湿地公园', content:`温榆河公园地处朝阳、顺义、昌平三区交界，温榆河、清河两河交汇处，城市副中心上游，是重要防洪通道，也是重要生态走廊。抓好温榆河公园规划建设，大幅度扩大绿色生态空间、满足人民群众对优美生态环境需要的重大民生工程，是落实新一版城市总体规划的一个亮点。
        “一轴一脉、九区一园”。“一轴”即游园栈道轴线；“一脉”即湿地净化水脉；“九区”分别为浅山梯田、湿地水乡、芦苇水淀、探险森林、花溪锦田、活力东湖、疏林草甸、清河乐谷、月色荷塘；“一园”即一期示范区公园。`},
        {title:'3温榆河湿地公园', content:`温榆河公园地处朝阳、顺义、昌平三区交界，温榆河、清河两河交汇处，城市副中心上游，是重要防洪通道，也是重要生态走廊。抓好温榆河公园规划建设，大幅度扩大绿色生态空间、满足人民群众对优美生态环境需要的重大民生工程，是落实新一版城市总体规划的一个亮点。
        “一轴一脉、九区一园”。“一轴”即游园栈道轴线；“一脉”即湿地净化水脉；“九区”分别为浅山梯田、湿地水乡、芦苇水淀、探险森林、花溪锦田、活力东湖、疏林草甸、清河乐谷、月色荷塘；“一园”即一期示范区公园。`},
        {title:'4温榆河湿地公园', content:`温榆河公园地处朝阳、顺义、昌平三区交界，温榆河、清河两河交汇处，城市副中心上游，是重要防洪通道，也是重要生态走廊。抓好温榆河公园规划建设，大幅度扩大绿色生态空间、满足人民群众对优美生态环境需要的重大民生工程，是落实新一版城市总体规划的一个亮点。
        “一轴一脉、九区一园”。“一轴”即游园栈道轴线；“一脉”即湿地净化水脉；“九区”分别为浅山梯田、湿地水乡、芦苇水淀、探险森林、花溪锦田、活力东湖、疏林草甸、清河乐谷、月色荷塘；“一园”即一期示范区公园。`},
        {title:'5温榆河湿地公园', content:`温榆河公园地处朝阳、顺义、昌平三区交界，温榆河、清河两河交汇处，城市副中心上游，是重要防洪通道，也是重要生态走廊。抓好温榆河公园规划建设，大幅度扩大绿色生态空间、满足人民群众对优美生态环境需要的重大民生工程，是落实新一版城市总体规划的一个亮点。
        “一轴一脉、九区一园”。“一轴”即游园栈道轴线；“一脉”即湿地净化水脉；“九区”分别为浅山梯田、湿地水乡、芦苇水淀、探险森林、花溪锦田、活力东湖、疏林草甸、清河乐谷、月色荷塘；“一园”即一期示范区公园。`}]
    }
	},
	mounted(){
		
	},
	methods:{
		goDetail(){
    }
	}
};
</script>

<style lang="scss" scoped>
@import "@/assets/css/basis";



</style>